<template>
	<view :class="[BackGround]" :style="[{'font-weight':Style,'font-family':Font,height:100 + '%',minHeight:height + 'px'}]">
		<cu-custom bgColor="bg-gradual-blue" isBack="true">
			<view slot="backText">返回</view>
			<view slot="content">修改大小修周期详情</view>
		</cu-custom>
		<view :class="['margin-xs radius shadow shadow-lg bg-white', BackGroundBox]" v-if="isShow">
			<form @submit="formSubmit" @reset="formReset">
				<!-- <view class="cu-form-group">
					<view class="title">修理类型</view>
					<picker @change="PickerChange1" name="LTYPE" :value="index1" :range="picker1" range-key="LNAME">
						<view class="picker">
							{{index1>-1? picker1[index1].LNAME : '请先选择'}}
						</view>
					</picker>
				</view>
				<view class="cu-form-group">
					<view class="title">修理位置</view>
					<view class="action item-icon" @tap="jumpdetail('修理位置',1)">
						{{item.LREPPOSITION ? item.LREPPOSITION : '请选择'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">修理方式</view>
					<view class="action item-icon" @tap="jumpdetail('修理方式',2)">
						{{item.LREPTYPPE ? item.LREPTYPPE : '请选择'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">修理要求</view>
					<view class="action item-icon" @tap="jumpdetail('修理要求',3)">
						{{item.LREPPRDTYPE ? item.LREPPRDTYPE : '请选择'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">需要零件</view>
					<view class="action item-icon" @tap="jumpdetail('需要零件',4)">
						{{item.LREPPRDTYPE ? item.LREPPRDTYPE : '请选择'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">油脂类型</view>
					<view class="action item-icon" @tap="jumpdetail('油脂类型',5)">
						{{item.LREPPRDTYPE ? item.LREPPRDTYPE : '请选择'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">供应商</view>
					<view class="action item-icon">
						{{item.LREPPRDTYPE ? item.LREPPRDTYPE : '请选择油脂类型'}}
					</view>
				</view>
				<view class="cu-form-group">
					<view class="title">周期(天)</view>
					<input type="number" name="zhouqi" :value="item.zhouqi" placeholder="请输入" />
				</view>
				<view class="cu-form-group">
					<view class="title">油量</view>
					<input type="text" name="youliang" :value="item.youliang" placeholder="请输入" />
				</view> -->
				
				<view class="cu-form-group">
					<view class="title">润滑位置</view>
					<input type="text" name="LREPPOSITION" :value="item.LREPPOSITION" />
				</view>
				<view class="cu-form-group">
					<view class="title">润滑方式</view>
					<input type="text" name="LREPTYPPE" :value="item.LREPTYPPE" />
				</view>
				<view class="cu-form-group">
					<view class="title">油脂类型</view>
					<input type="text" name="LREPPRDTYPE" :value="item.LREPPRDTYPE" />
				</view>
				<view class="cu-form-group">
					<view class="title">供应商</view>
					<input type="text" name="LPTNCODE" :value="item.LPTNCODE" />
				</view>
				
				<view class="cu-form-group">
					<view class="title">油量单位</view>
					<picker @change="PickerChange1" name="LUNIT" :value="index1" :range="picker1" range-key="LNAME">
						<view class="picker">
							{{picker1[index1].LNAME}}
						</view>
					</picker>
				</view>
				<view class="cu-form-group">
					<view class="title">油量</view>
					<input type="text" name="LREPWEIGHT" :value="item.LREPWEIGHT" />
				</view>
				<view class="cu-form-group">
					<view class="title">周期(天)</view>
					<input type="number" name="LREPCIRCLE" :value="item.LREPCIRCLE" />
				</view>
				<button-father :Position="'tb-fa-fixed'">
					<button class="cu-btn bg-gradual-blue lg shadow tb-flex cu-btn-new" form-type="submit">确认</button>
				</button-father>
			</form>
		</view>
	</view>
</template>

<script>
	import ButtonFather from '@/colorui/components/ButtonFather.vue'
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				isShow: true,
				height:this.screenHeight,
				picker1: [{
						"LNAME": "KG"
					},
					{
						"LNAME": "只"
					},
					{
						"LNAME": "包"
					},
					{
						"LNAME": "袋"
					},
					{
						"LNAME": "瓶"
					},
				],
				index1: 0,
				index: 0,
				item: {},
			}
		},
		computed: {
			...mapGetters(['Style', 'Font', 'modifygetitem', 'modifygetlist','BackGround','BackGroundBox'])
		},
		components: {
			ButtonFather
		},
		onUnload() {
			this.delitem({})
		},
		onShow() {
			if (Object.keys(this.modifygetitem).length) {
				for (let var1 in this.modifygetitem) {
					this.$set(this.item, var1, this.modifygetitem[var1])
				}
			}
		},
		onLoad(options) {
			this.item = JSON.parse(options.item)
			console.log(JSON.parse(options.item));
			this.index = options.index
		},
		methods: {
			...mapMutations(['modifydellist', 'modifysetlist', 'delitem']),
			PickerChange1(e) {
				this.index1 = e.detail.value
			},
			// 跳转详情
			jumpdetail(info, page) {
				uni.navigateTo({
					url: `./modifadddetail/modifadddetail?name=${info}&Page=${page}`
				})
			},
			formSubmit(e) {
				//定义表单规则
				var rule = [{
					name: "LREPPOSITION",
					checkType: "notnull",
					errorMsg: "请输入润滑位置"
				}, {
					name: "LREPTYPPE",
					checkType: "notnull",
					errorMsg: "请输入润滑方式"
				}, {
					name: "LREPPRDTYPE",
					checkType: "notnull",
					errorMsg: "请输入油脂类型"
				}, {
					name: "LPTNCODE",
					checkType: "notnull",
					errorMsg: "请输入供应商"
				}, {
					name: "LREPWEIGHT",
					checkType: "notnull",
					errorMsg: "请输入油量"
				}, {
					name: "LREPCIRCLE",
					checkType: "notnull",
					errorMsg: "请输入周期"
				}, ];
				//进行表单检查
				var formData = e.detail.value;
				var checkRes = this.$graceChecker.check(formData, rule);
				if (!checkRes) {
					uni.showToast({
						title: this.$graceChecker.error,
						icon: "none"
					});
				} else {
					this.item = Object.assign(this.item, e.detail.value)
					this.modifydellist(this.index)
					this.modifysetlist(this.item)
					uni.navigateBack({
						delta: 1
					})
					uni.showToast({
						title: '添加成功',
						icon: 'success',
						duration: 3000
					});

				}
			}
		}
	}
</script>

<style>
	page {
		background-color: whitesmoke;
	}
</style>
